import React from 'react';
import Button from '../components/Button';

export default {
  title: '2 - Button',
  component: Button,
  decorators: [
		(Story) => (
			<div className="canvas">
				<Story/>
			</div>
		),
	],
  argTypes: {
		isOutlined: { control: 'boolean', defaultValue:false},
		isDisabled: { control: 'boolean', defaultValue:false},
    color: {options: ['red', 'blue', 'yellow', 'orange', 'purple', 'cyan', 'base03']},
	},
}

const onClick = (e) => console.log('YO');

const Template = (args) => <div style={{width: 250}}>
  <Button {...{...args, onClick}}>
    this is a Button | 按钮
  </Button>
	{/* <div onClick={onClick} >yoyo</div> */}
</div>

export const Primary = Template.bind({});
